<script setup>
import Left from './components/Left.vue'
import Center from './components/Center.vue'
import Right from './components/Right.vue'
</script>

<template>
  <div id="container">
    <div id="left">
      <Left></Left>
    </div>
    <div id="center">
      <Center></Center>
    </div>
    <div id="right">
      <Right></Right>
    </div>
  </div>
</template>

<style scoped>
#container{
  display: flex;
  width: 100%;
  height: 60%;
}
#left{
  height: 100%;
  flex: 1;
  border: 1px solid #000000;
}
#center{
  height: 100%;
  flex: 1.5;
  border: 1px solid #000000;
  border-left:none;
  border-right:none;
}
#right{
  height: 100%;
  flex: 1;
  border: 1px solid #000000;
}
</style>
